<template>
	<view>
		<view class="topFixedBox">
			<image src="/static/image/home/logo.png" mode="widthFix"></image>
		</view>
		<view class="" style="width:100%;height: 180rpx;">
		</view>
		<view class="swiperBox">
			<u-swiper imgMode="contain" autoplay circular indicator indicatorMode="dot" height="136"
				:list="swiperList"></u-swiper>
		</view>
		<view class="navBox">
			<view class="navItem" @click="openCompany">
				<p>
					<image src="/static/image/home/icon1.png" mode="widthFix"></image>
				</p>
				<text>公司介绍</text>
			</view>
			<view v-for="(item,index) in navList" :key="index" class="navItem" @click="checkGo(item)">
				<p>
					<image :src="item.img" mode="widthFix"></image>
				</p>
				<text>{{item.name}}</text>
			</view>

		</view>
		<view class="navBox2">
			<view class="">
				<p>客服二维码</p>
				<image :src="serviceCode" @click="previewImg(serviceCode)" mode="widthFix"></image>
			</view>
			<view class="">
				<p>关注视频号</p>
				<image :src="videoData.url" @click="previewImg(videoData.url)" mode="widthFix"></image>
			</view>
		</view>
		<view class="noticeBox" style="margin-bottom: 80rpx;">
			<view class="noticeTitle" @click="goRoute('/subpackages/policyInfo/policyInfo')">
				<p>售电政策信息</p>
				<p>
					<text>更多</text>
					<u-icon name="arrow-right" color="#999" size="16"></u-icon>
				</p>
			</view>
			<view class="noticeBar">
				<p @click="openPdf(item.url)" v-for="(item,index) in policyList" :key="index">{{item.theme}}</p>
			</view>
		</view>
		<view class="noticeBox">
			<view class="noticeTitle" @click="goRoute('/subpackages/knowledgeExpansion/knowledgeExpansion')">
				<p>知识拓展</p>
				<p>
					<text>更多</text>
					<u-icon name="arrow-right" color="#999" size="16"></u-icon>
				</p>
			</view>
			<view class="noticeBar">
				<p v-for="(item,index) in knowledgeList" @click="goRoute('/subpackages/knowledgeExpansion/detail',item)"
					:key="index">{{item.theme}}</p>
			</view>
		</view>
		
		<view v-show="videoPlay">
			<video controls id="myvideo" :src="videoUrl" @fullscreenchange="screenChange"></video>
		</view>
	</view>
</template>
<script>
	import {
		mapState,
		mapActions
	} from 'vuex'
	export default {
		data() {
			return {
				videoUrl: '',
				videoPlay: false,
				swiperList: ['/static/image/home/banner.png', '/static/image/home/banner.png',
					'/static/image/home/banner.png'
				],
				list1: [{
					name: '案例视频',
				}, {
					name: '案例信息',
				}],
				navList: [{
						img: '/static/image/home/icon2.png',
						name: '诚招合伙人',
						path: '/subpackages/companyIntro/companyIntro',
					},
					{
						img: '/static/image/home/icon4.png',
						name: '注册网签流程',
						path: '/subpackages/operationalFlow/operationalFlow'
					},
					{
						img: '/static/image/home/icon3.png',
						name: '电量申报',
						path: '/subpackages/electricityDeclaration/electricityDeclaration',
						check:true
					},
					// {
					// 	img: '/static/image/home/icon4.png',
					// 	name: '代理商入口',
					// 	path: '/subpackages/powerSales/powerSales',

					// },
				],
				policyList: [],
				knowledgeList: [],
				serviceCode: [],
				companyPdf: '',
				caseList1: [],
				caseList2: [],
				videoData: {}
			};
		},
		created() {
			this.getServiceCode()
			this.gzKnowledgeExpand()
			this.gzPolicyDocument()
			this.gzPicture()
			this.gzFollowVideoAccount()
			this.getCompanyInfo()
			this.getCaseList(1)
			this.getCaseList(2)
			if (this.isLogin()) {
				this.getUserInfo()
			}
		},
		methods: {
			...mapActions({
				getUserInfo: 'getUserInfo'
			}),
			checkGo(item) {
				if (item.check) {
					this.goLogin(item.path)
				} else {
					this.goRoute(item.path)
				}
			},
			openCompany() {
				// this.openPdf(this.companyPdf)
				this.previewImg(this.companyPdf)
			},
			screenChange(e) {
				let fullScreen = e.detail.fullScreen; // 值true为进入全屏，false为退出全屏
				if (!fullScreen) {
					//退出全屏
					this.videoPlay = false; // 隐藏播放盒子
				}
			},
			// 获取二维码
			getServiceCode() {
				this.$api.getServiceCode({
					pageNo: 1,
					pageSize: 10
				}).then(res => {
					if (res.data.code == 200) {
						this.serviceCode = res.data.result.records[0]?.link
					}
				})
			},
			previewImg(url) {
				uni.previewImage({
					urls: [url]
				})
			},
			openDetail(e) {
				if (e.caseType == 2) {
					this.goRoute('/subpackages/case/detail', e)
				} else {
					this.videoContext = uni.createVideoContext("myvideo", this);
					this.videoUrl = e.casePath;
					this.videoContext.requestFullScreen({direction:0});
					this.videoContext.play();
					this.videoPlay = true; // 显示播放盒子
				}
			},
			// 获取知识拓展数据
			gzKnowledgeExpand() {
				this.$api.gzKnowledgeExpand({
					pageNo: 1,
					pageSize: 5
				}).then(res => {
					if (res.data.code == 200) {
						this.knowledgeList = res.data.result.records
					}
				})
			},
			// 获取政策
			gzPolicyDocument() {
				this.$api.gzPolicyDocument({
					pageNo: 1,
					pageSize: 5
				}).then(res => {
					if (res.data.code == 200) {
						this.policyList = res.data.result.records
					}
				})
			},
			// 获取轮播图
			gzPicture() {
				this.$api.gzPicture({
					pageNo: 1,
					pageSize: 10
				}).then(res => {
					if (res.data.code == 200) {
						this.swiperList = res.data.result.records
					}
				})
			},
			// 获取视频号
			gzFollowVideoAccount() {
				this.$api.gzFollowVideoAccount({
					pageNo: 1,
					pageSize: 10
				}).then(res => {
					if (res.data.code == 200) {
						this.videoData = res.data.result.records[0]
					}
				})
			},
			getCompanyInfo() {
				this.$api.getCompanyInfo({
					pageNo: 1,
					pageSize: 10
				}).then(res => {
					if (res.data.code == 200) {
						this.companyPdf = res.data.result.records[0].companyUrl
					}
				})
			},
			getCaseList(type) {
				this.$api.getCaseList({
					pageNo: 1,
					pageSize: 4,
					caseType: type,
				}).then(res => {
					if (res.data.code == 200) {
						if (type == 1) {
							this.caseList1 = res.data.result.records
						} else {
							this.caseList2 = res.data.result.records
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import 'home.scss'
</style>
<style>
	page {
		background-color: #F3F4F9;
		padding-bottom: 150rpx;
	}
</style>